<template>
    <div class="template-index-Lu">
        <a-modal
            :visible="inoutStorageLogsVisible"
            title=""
            :maskClosable="false"
            :closable="true"
            :destroyOnClose="true"
            width="60%"
            :dialog-style="{ margin: '0 auto'}"
            wrapClassName=""
            @cancel="closeVisible"
            >
            <template slot="footer">
                <a-button class="blue-btn" @click="closeVisible">关闭</a-button>
            </template>
            <commpVxeTable
                :key="reCommpVxeTable"
                :occupancyHeight="200"
                :config="dataTableConfig"
                :columns="columnsVxe"
                :formItem="formItem"
                @checkboxChange="checkboxChange"
                ref="administrativeOffice"
                @searchEvent="searchEvent"
                @resetEvent="resetEvent"
                >
            </commpVxeTable>
        </a-modal>
    </div>
</template>
<script>
import assessCheckApi from './service/api.js'
import commpVxeTable from '@/components/commp-vxe-table/commp-vxe-table.vue'
import {queryKcjlPageList} from './service/index'
export default {
    components: {
        commpVxeTable,
    },
    props:{
        fkcid:{
            type:String,
            default:'',
            required:false,
        }
    },
    data() {
      return {
        reCommpVxeTable: '',
        inoutStorageLogsVisible: false,
        dataTableConfig: {
            api: assessCheckApi.queryKcjlPageList,
            rowId: 'id',
            urlType: true,
            paramet:{
                fkcid: this.fkcid
            }
        },
        columnsVxe: [
          {
            type: 'checkbox',
            width: 60,
            fixed: 'left'
          },{
            title: '操作类型',
            field: 'fczlx',
            width: 100
          },{
            title: '物品名称',
            field: 'fwpmc',
          },{
            title: '物品数量',
            field: 'fwpsl',
            width: 100
          },{
            title: '操作数量',
            field: 'fczsl',
            width: 100
          },{
            title: '剩余库存量',
            field: 'fsysl',
            width: 100
          },{
            title: '操作人',
            field: 'fczr',
            width: 100
          },{
            title: '操作科室',
            field: 'fczks',
          },{
            title: '操作时间',
            field: 'fczsj',
            width: 200
          }
        ],
        formItem: [
          {
            label: '操作类型',
            model: 'fczlx',
          },{
            label: '操作人',
            model: 'fczr',
          },{
            label: '操作科室',
            model: 'fczks',
          },{
            label: '操作开始时间',
            model: 'startTime',
            type: 'datePicker',
            format: 'YYYY-MM-DD'
          },{
            label: '操作结束时间',
            model: 'endTime',
            type: 'datePicker',
            format: 'YYYY-MM-DD'
          }
        ],
      }
    },
    watch: {
        fkcid(newval,oldVal){
            //console.log('fkcid',newval)
            this.fkcid = newval
            this.dataTableConfig.paramet = {
                fkcid: this.fkcid
            }
            this.reCommpVxeTable = Date.now()
        }
    },
    created(){
    },
    methods: {
        // 勾选
        checkboxChange(val){
            //console.log('已选择',val)
            this.jobidList = []
            if(val.length){
            val.forEach(item => {
                this.jobidList.push(item.jobid)
            });
            }
        },
        // 搜索
        searchEvent(){
            this.dataTableConfig.paramet = {
                ...this.dataTableConfig.paramet,
            }
            //console.log(this.dataTableConfig.paramet)
        },
        // 重置
        resetEvent(){
            this.dataTableConfig.paramet = {
                ...this.dataTableConfig.paramet,
            }
        },
        // 弹窗提交成功
        success(){
            // 刷新表格 清空id数组
            this.$refs.administrativeOffice.resetEvent()
            this.jobidList = []
        },
        closeVisible(){
            this.inoutStorageLogsVisible = false
        }
    },
}
</script>
